<template>
  <div>
    <el-card class="box-card" style="margin-left: 250px;margin-top: 80px;">
      <div slot="header" class="clearfix">
        <span>用户信息</span>
        <el-button style="float: right; padding: 3px 0" type="text" @click="edit">修改</el-button>
      </div>
      <div class="text item">编号：     {{this.info[0]["uid"]}}</div>
      <div class="text item">所属机构编号：     {{this.info[0]["jid"]}}</div>
      <div class="text item">名称：     {{this.info[0]["username"]}}</div>
      <div class="text item">真实姓名：     {{this.info[0]["truename"]}}</div>
      <div class="text item">身份证号：     {{this.info[0]["idcardnumber"]}}</div>
      <div class="text item">身份：     {{this.info[0]["identity"]}}</div>
      <div class="text item">权限级别：     {{this.info[0]["authority"]}}</div>
    </el-card>

  </div>
</template>

<script>
    export default {
      name: "UserProFile",
      props: ['id','name'],
      data() {
        return {
          info: []
        }
      },
      beforeRouteEnter: (to,from,next) => {
        console.log('进入路由之前');//加载数据
        next(vm => {
          vm.getData();//进入路由之前执行getData()
        })
      },
      beforeRouteLeave: (to,from,next) => {
        console.log('进入路由之后');
        next()
      },
      methods: {
        edit:function (){
          this.$router.push("/personalEdit");
        },
        getData:function() {
          /*this.axios({
            method: 'get',
            url: 'http://evidence.frogking.cn/userController/selectByUid?token=Rp6npIeiQ93mSFpsmeg7gA=='
          }).then(response=>(console.log(response)));*/
          this.axios({
            method:"post",
            headers: { 'content-type': 'application/json' },
            url: "http://evidence.frogking.cn/userController/selectByUid",
            params:{
              token: localStorage.getItem("token_only")
            }
          }).then(res=>{
            this.info=[res["data"]["item"]];
          }).catch(function (error) {
            console.log(error);
          })
        }
      }
    }
</script>

<style>

.el-col {
  border-radius: 4px;
}
.bg-purple-dark {
  background: #99a9bf;
}
.bg-purple {
  background: #d3dce6;
}
.bg-purple-light {
  background: #e5e9f2;
}
.grid-content {
  border-radius: 4px;
  min-height: 36px;
}
.row-bg {
  padding: 10px 0;
  background-color: #f9fafc;
}
.text {
  font-size: 14px;
}

.item {
  margin-bottom: 18px;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}
.clearfix:after {
  clear: both
}

.box-card {
  width: 480px;
}
</style>
